* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* 设置大盒子的背景图 */
body {
  background-image: url(../img/bg.png);
  background-size: cover;
  background-repeat: no-repeat;
  color: #5e5a6e;
}

/* 登录/注册盒子 */
.formInfo {
  position: absolute;
  right: 100px;
  top: 100px;
  width: 480px;
  height: 659px;
  background-color: #eeffffe6;
  border-radius: 10px;
  display: flex;
  display: -webkit-flex;
  display: -moz-flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

/* 设置盒子之间的间距 */
.formInfo .inputBox,
.btns {
  position: relative;
  margin-top: 46px;
}

/* 设置提示信息的相关属性 */
label {
  font-size: 15px;
  line-height: 40px;
  position: absolute;
  left: 20px;
  transition-duration: 0.3s;
  color: #828282;
}

/* 输入框 */
input {
  width: 347px;
  height: 40px;
  padding: 0 20px;
  outline: 0;
  border: 2px solid rgb(148, 148, 148);
  border-radius: 20px;
  transition: all .3s ease;
}

/* 选中时变化 */
input:focus {
  background-color: #e8f0fe;
  border-color: #399af2;
  border-radius: 10px;
}

/* 反馈信息框 */
.fbInfo {
  color: #ff0000;
}

/* 按钮 */
.btns {
  display: -webkit-flex;
  display: -moz-flex;
  justify-content: space-around;
  align-items: center;
  height: 50px;
  width: 300px;
}

.btns button {
  width: 100px;
  height: 40px;
  outline: medium;
  border: 1px #3b78dd solid;
  font-size: 20px;
}

button:nth-child(1) {
  color: #fff;
  background-color: #3b78dd;
}

button:nth-child(1):hover {
  background-color: #265fd7;
  border-color: #265fd7;
}

button:nth-child(2) {
  border: 1px #000 solid;
  background-color: #fff;
}

button:nth-child(2):hover {
  background-color: #bdbdbd;
}


/* 密码强度 */
#pwd_strengthBox {
  margin: 10px;
  transform: translateX(-50px);
  width: 240px;
  height: 10px;
  border-radius: 5px;
  background-color: #808080;
}

#pwd_strength {
  height: 100%;
  border-radius: 5px;
  transition: all .4s;
}